<template>
<div>
	<select v-model.number="num">
		<option value="1">1</option>
		<option value="2">2</option>
		<option value="3">3</option>
	</select>
	<button @click="clickIncreament">增加</button>
	<button @click="clickDecreament">减少</button>
	<button @click="clickIncreamentIfOdd">奇数增加</button>
	<button @click="clickIncreamentAsync">异步增加（延迟1秒）</button>
</div>
</template>
<script setup>
import {ref} from "vue"
import useCounterStore from  "@/stores/counter.js"
const num=ref(1)
const counterStore=useCounterStore()
const clickIncreament=()=>{
	counterStore.increament(num.value)
}
const clickDecreament=()=>{
	counterStore.decreament(num.value)
}
const clickIncreamentIfOdd=()=>{
	counterStore.increamentIfOdd(num.value)
}
const clickIncreamentAsync=()=>{
	counterStore.increamentAsync(num.value)
}
</script>